﻿
@{
    ViewData["Title"] = "企业媒体MediaEdit";
}

@section Scripts
    {
    <script type="text/javascript">
        function Delete(obj) {
            var id = obj.id;
            console.log("123456");
            console.log(id);
            //   $("#demoList tr[name='tr_" + index + "']").remove();
             axios.delete('/Enterprise/DeleteEnterPrisePropaganda', {
                            params: {
                                id: id
                            }
                        })
        }


        var selfLayer = null, page = 1, active = null;
        layui.use(['form', 'layedit', 'upload'], function () {
            var form = layui.form, upload = layui.upload; //表格


                     axios.get('/Enterprise/GetEnterPrisePropagandaAll', {
                        params: {
                            "id": '@ViewBag.Id',
                        }
                     }).then(function (response) {
                        if (response.data.code == 200) {

                            if (response.data.result.data != null)
                            {
                                $.each(response.data.result.data, function (n, value) {
                                    //console.log("369258");
                                    //console.log(value.fileUrl);
                                    //console.log(value.fileUrl);
                                    var result = "";
                                    result += "<tr id='" + value.id + "' name='tr_" + n+ "'>";
                                    result += "<td name='file_" + value.id + "'>" + value.fileUrl + "</td>";
                                    result += "<td>已上传</td>";
                                  //  result += "<td><button id='" + value.FileUrl +"' class='' onclick='previewImg(this)'>查看</button></td>";
                                    result += "<td><img src='" + value.fileUrl + "'  width='40px' height='30px' class='layui - upload - img' onclick='previewImg(this)'></td>";
                                    result += "<td><button id='" + value.id +"' class='layui-btn layui-btn-xs layui-btn-danger demo-delete' onclick = 'Delete(this)'>删除</button></td>";
                                    result += "</tr>";
                                    demoListView.append(result);
                                 //   mediaImageAll.push({ "FileUrl": value.FileUrl });
                                })
                            }

                            layui.use('form', function () {
                                var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
                                form.render();
                            });
                        } else {
                            console.log(response.data.msg);
                        }
                        })

            //多文件列表示例
            var demoListView = $('#demoList')
                , uploadListIns = upload.render({
                    elem: '#testList'
                    , url: 'https://localhost:5001/api/Upload/UploadFile?typeName=企业宣传&id=' + '@ViewData["Id"]'
                    , accept: 'file'
                    , multiple: true
                    , auto: false
                    , bindAction: '#testListAction'
                    , choose: function (obj) {
                        var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
                        //读取本地文件
                        obj.preview(function (index, file, result) {
                            var tr = $(['<tr id="upload-' + index + '">'
                                , '<td>' + file.name + '</td>'
                                , '<td>' + (file.size / 1014).toFixed(1) + 'kb</td>'
                                , '<td>等待上传</td>'
                                , '<td>'
                                , '<button class="layui-btn layui-btn-xs demo-reload layui-hide">重传</button>'
                                , '<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>'
                                , '</td>'
                                , '</tr>'].join(''));

                            //单个重传
                            tr.find('.demo-reload').on('click', function () {
                                obj.upload(index, file);
                            });

                            //删除
                            tr.find('.demo-delete').on('click', function () {
                                delete files[index]; //删除对应的文件
                                tr.remove();
                                uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
                            });

                            demoListView.append(tr);
                        });
                    }
                    , done: function (res, index, upload) {
                        console.log("1235465");
                        console.log(res);
                        if (res.httpCode == 200) { //上传成功
                            var tr = demoListView.find('tr#upload-' + index)
                                , tds = tr.children();
                            tds.eq(2).html('<span style="color: #5FB878;">上传成功</span>');
                            tds.eq(3).html(''); //清空操作
                            return delete this.files[index]; //删除文件队列已经上传成功的文件
                        }
                        this.error(index, upload);
                    }
                    , error: function (index, upload) {
                        var tr = demoListView.find('tr#upload-' + index)
                            , tds = tr.children();
                        tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
                        tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
                    }
                });

        });
    </script>
}
<form class="layui-form layui-form-pane">
    <div class="layui-upload">
        <button type="button" class="layui-btn layui-btn-normal" id="testList">选择多文件</button>
        <div class="layui-upload-list">
            <table class="layui-table">
                <thead>
                    <tr>
                        <th>文件名</th>
                        <th>大小</th>
                        <th>状态</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody id="demoList"></tbody>
            </table>
        </div>
        <button type="button" class="layui-btn" id="testListAction">开始上传</button>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <a style="width: 100px" class="layui-btn layui-btn-primary" asp-action="MediaList">返回</a>
        </div>
    </div>
</form>
